<template>
	<div>
		<el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect"
		background-color="#545c64" text-color="#fff" active-text-color="#ffd04b">
			<el-menu-item index="1" @click="goto('/')">首页</el-menu-item>
			<el-menu-item index="2" @click="goto('/addGood')">添加商品</el-menu-item>
			<el-menu-item index="3" @click="goto('/center')">个人中心</el-menu-item>
			<el-menu-item index="4" @click="goto('/shopping')">购物车</el-menu-item>
			<el-menu-item index="5" @click="goto('/login')">登录</el-menu-item>
			<el-menu-item index="6" @click="goto('/regist')">注册</el-menu-item>
		</el-menu>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				activeIndex: '1'
			};
		},
		methods: {
			handleSelect(key, keyPath) {
				console.log(key, keyPath);
			},
			goto(path) {
				this.$router.push(path);
			}
		}
	}
</script>
